<template >
  <div id="login">
    <el-form
      label-position="lift"
      :model="ruleForm"
      :rules="rules"
      ref="ruleForm"
      label-width="100px"
      class="demo-ruleForm"
    >
      <el-form-item label="账号" prop="account">
        <el-input v-model="ruleForm.account"></el-input>
      </el-form-item>

      <el-form-item label="密码" prop="password">
        <el-input v-model="ruleForm.password"></el-input>
      </el-form-item>

      <el-form-item label="身份" prop="type">
        <el-radio-group v-model="ruleForm.type">
          <el-radio label="销售经理"></el-radio>
          <el-radio label="运营管理"></el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="submitForm">登陆</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>


import { createNamespacedHelpers } from "vuex";
const { mapState, mapMutations, mapActions } = createNamespacedHelpers("login");
export default {
  computed: {
    //   计算属性type保存登陆人类型
    isAdmin: function () {
      if (this.ruleForm.type == "销售经理") {
        return false;
      } else {
       if( this.ruleForm.type == "运营管理"){
            return true;
       }else{
         return 2
       }
     
      }
    },
  },
  data() {
    return {
      ruleForm: {
        account: "",
        password: "",

        type: "",
      },
      rules: {
        account: [
          { required: true, message: "请输入账号", trigger: "blur" },
          {
            min: 6,
            max: 10,
            message: "长度在 6 到 11 个字符",
            trigger: "blur",
          },
        ],
        password: [
          { required: true, message: "请填写密码", trigger: "blur" },

          {
            min: 6,
            max: 10,
            message: "长度在 6 到 11 个字符",
            trigger: "blur",
          },
        ],

        type: [
          { required: true, message: "请选择登陆身份", trigger: "change" },
        ],
      },
    };
  },
  methods: {
    //  获取仓库的登陆函数
    ...mapActions(["login"]),

    // 提交事件
    async submitForm() {
      let user = {
        ...this.ruleForm,
        isAdmin: this.isAdmin,
      };
       if(user.isAdmin==2){
         alert("请选择身份");
         return
       }
      //data保存登陆是否成功 0失败 1成功
      let data = await this.login(user);
    
      if (data) {
      
        alert("登陆成功");
        this.$router.push({ path: "/system" });
      } else {
        alert("登陆失败");
      }
    },
    //   resetForm(formName) {
    //     this.$refs[formName].resetFields();
    //   }
  },
};
</script>


<style>
 #login .el-form {
  width: 500px;
  height: 280px;
  margin: 100px auto;
  border: 1px solid gainsboro;
  padding: 50px 50px;
}
 #login .el-form-item {
  margin-left: -30px;
}
</style>